<!DOCTYPE html>
<html lang="zh-cn">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>房产信息管理系统</title>
    <load href='__PUBLIC__/css/bootstrap.min.css' />
    <script src="http://lib.sinaapp.com/js/jquery/1.9.1/jquery-1.9.1.min.js"></script>
    <load href='__PUBLIC__/js/bootstrap.min.js' />
    <style type="text/css">
    	body { 
    		padding-top: 50px; 
    	}
    	#name{
    		margin-left: 120px;
    	}
    	.nav{
    		margin: 50px auto;
    	}
    	#change{
    		margin-left: 100px;
    		margin-top: 20px;
    	}
    	#password{
    		text-align: center;
    		font-family: "微软雅黑";
    		color: red;
    	}
    	#email{
    		text-align: center;
    	}
    	#phone{
    		text-align: center;
    	}
    </style>
  </head>
  <body>
  	<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
	  <div class="container">
	    <div class="row">
	    	<div class="col-md-10">
	      		<a class="navbar-brand" href="__CONTROLLER__/main">
	        		<p>房产信息管理</p>
	      		</a>
	      	</div>
	      	<div class="col-md-2">
	      		<button type="button" class="btn btn-info navbar-btn navbar-right dropdown-toggle"  data-toggle="dropdown">
					{$name}<span class="caret"></span>
				</button>
				<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu" id="name">
				     <li><a tabindex="-1" href="__CONTROLLER__/main">返回主页</a></li>
				     <li><a tabindex="-1" href="javascript:history.go(-1);">返回上一页</a></li>
   					 <li><a tabindex="-1" href="__CONTROLLER__/userinfo">查看个人信息</a></li>
   					 <li><a tabindex="-1" href="__CONTROLLER__/houserentinfo">查看发布信息</a></li>
    				 <li><a tabindex="-1" href="__CONTROLLER__/loginout">退出</a></li>
    			</ul>
	      	</div>
	    </div>
	  </div>
	</nav>
  	
  	<div class="container">
		<div class="row">
			<div class="col-md-1"></div>
			<div class="col-md-10">
				    <ul class="nav nav-tabs">
					    <li class="active">
					    	<a href="javascript:;">修改个人资料</a>
					    </li>
					</ul>
					<div class="col-md-4" id="head-sculpture">
						<img class="img-thumbnail" src="__PUBLIC__/i/1.jpg" alt="..." >
						<button class="btn btn-primary btn-lg" type="button" id="change">更改头像</button>
					</div>
					<div class="col-md-8">
						<form class="form-horizontal" role="form" action="__CONTROLLER__/update_userinfo" method="post">
							<div class="form-group">
								<label class="control-label col-md-2">用户名</label>
								<div class="col-md-6">
									<input class="form-control" type="text" name="name" placeholder="{$name}">
								</div>
								<!--<div class="col-md-4"></div>-->
							</div>
							
							<div class="form-group">
								<label class="control-label col-md-2">登录密码</label>
								<label class="control-label col-md-2" id="password">已设置</label>
								<div class="col-md-2 col-md-offset-1">
									<a class="btn btn btn-default" href="__CONTROLLER__/editpassword">修改</a>
								</div>
							</div>
							
							<div class="form-group">
								<label class="control-label col-md-2">邮箱</label>
								<label class="control-label col-md-3" id="email">{$email}</label>
								<div class="col-md-2 col-md-offset-1">
									<a class="btn btn btn-default" href="__CONTROLLER__/editemail">修改</a>
								</div>
							</div>
							
							<div class="form-group">
								<label class="control-label col-md-2">手机</label>
								<label class="control-label col-md-2" id="phone">{$phone}</label>
								<div class="col-md-2 col-md-offset-1">
									<a class="btn btn btn-default" href="__CONTROLLER__/editphone">修改</a>
								</div>
							</div>
							
							<div class="form-group">
								 <label class="control-label col-md-2">性别</label>
					   			 <div class="col-md-6">
					   			 	  <if condition="$sex eq '男'">
						    			  <input class="radio radio-inline" type="radio" value="男" name="sex" checked="checked">男
						    			  <input class="radio radio-inline" type="radio" value="女" name="sex">女
						    		  <else/>
						    		  	  <input class="radio radio-inline" type="radio" value="男" name="sex">男
						    			  <input class="radio radio-inline" type="radio" value="女" name="sex" checked="checked">女
						    		  </if>
					   			 </div>
							</div>
							
							<div class="form-group">
								<label for="inputBirth" class="col-md-2 control-label">所在城市</label>
								<div class="col-md-4">
									<select name="province" class="form-control" id="province">
										<option value="{$province}" selected = "selected" >{$province}</option>
										<volist name="dprovince" id="dprovince">
											<option value="{$dprovince.name}">{$dprovince.name}</option>
										</volist>
									</select>
								</div>
								<div class="col-md-2">
									<select name="city" class="form-control" id="city">
										<option value="{$city}" selected = "selected" >{$city}</option>
										<volist name="dcity" id="dcity">
											<option class='city_a' value="{$dcity.name}">{$dcity.name}</option>
										</volist>
									</select>
								</div>
								<div class="col-md-2">
									<select name="area" class="form-control" id="area">
										<option value="{$area}" selected = "selected" >{$area}</option>
										<volist name="county" id="county">
											<option value="{$county.name}">{$county.name}</option>
										</volist>
									</select>
								</div>
							</div>
							
							<div class="form-group">
								<div class="col-md-1"></div>
								<div class="col-md-5 col-md-offset-1">
									<input class="btn btn-info btn-lg btn-block" type="submit" value="保存"/>
								</div>
								<!--<div class="col-md-7"></div>-->
							</div>
							
						</form>
					</div>
			</div>
			<div class="col-md-1"></div>
		</div>  		
  	</div>
  	
  </body>
  <script type="text/javascript">
	    $(".add-on").height("25px");
	    $(function(){
	    	$("#province").change(function(){
	    		var pname=$("#province").val();
	    		$.ajax({
	    			type:"POST",
	    			data:"provincename="+pname,
	    			url: "__CONTROLLER__/city",
	    			success:function(data){
	    				$("#city").html("");
	    				for(var i=0;i<data.city.length;i++){
	    					if(i==0){
	    						$("#city").append("<option class='city_a' value="+data.city[i]+"selected = 'selected' >"+data.city[i]+"</option>");
	    					}else{
	    						$("#city").append("<option class='city_a' value="+data.city[i]+">"+data.city[i]+"</option>");
	    					}
	    				}
	    				$("#city").change(cityChange);
	    				
	    				var cname=$(".city_a").eq(0).html();
	    				$.ajax({
	    					type:"POST",
	    	    			data:"cityname="+cname,
	    	    			url: "__CONTROLLER__/area",
	    	    			success:function(area){
	    	    				$("#area").html("");
	    	    				for(var i=0;i<area.area.length;i++){
	    	    					if(i==0){
	    	    						$("#area").append("<option value="+area.area[i]+"selected = 'selected' >"+area.area[i]+"</option>");
	    	    					}else{
	    	    						$("#area").append("<option value="+area.area[i]+">"+area.area[i]+"</option>");
	    	    					}
	    	    				}
	    	    			}
	    				});
	    			}
	    		});
	    	});
	    	
	    	$("#city").change(cityChange);
	    	function cityChange(){
	    		var cname=$("#city").val();
	    		$.ajax({
					type:"POST",
	    			data:"cityname="+cname,
	    			url: "__CONTROLLER__/area",
	    			success:function(area){
	    				$("#area").html("");
	    				for(var i=0;i<area.area.length;i++){
	    					if(i==0){
	    						$("#area").append("<option value="+area.area[i]+"selected = 'selected' >"+area.area[i]+"</option>");
	    					}else{
	    						$("#area").append("<option value="+area.area[i]+">"+area.area[i]+"</option>");
	    					}
	    				}
	    			}
				});
	    	}
	    });
  </script>
</html>
